import QtQuick
import QtQuick.Controls.Material

Rectangle{          // 报警信息框
    width: 620
    height: 440
    // border.width: 1
    radius: 5
    clip: true
    color:"lightgray"

    // 横向布局：子Rectangle无缝排列（无间隙）
    Row {
        id: titleRow
        anchors.top: parent.top
        width: parent.width
        height: 40
        spacing: 0

        property real titalHeight: 40

        // 1. 开始日期：子Rectangle包裹（白底+边框+黑字）
        Rectangle {
            width: 112.7  ;height : parent.titalHeight ;color: "#ffffff" ;border.color: "#cccccc" ;border.width: 1 ;
            Text {
                anchors.centerIn: parent  ;font.pixelSize: 14 ;font.bold: true ;color: "#000000"  ;
                text: qsTr("开始日期") ;
            }
        }

        // 2. 开始时间：子Rectangle包裹
        Rectangle {
            width: 112.7 ;height : parent.titalHeight ;color: "#ffffff" ;border.color: "#cccccc" ;border.width: 1 ;

            Text {
                anchors.centerIn: parent ;font.pixelSize: 14 ;font.bold: true ;color: "#000000" ;
                text: qsTr("开始时间") ;
            }
        }

        // 3. 信息描述：子Rectangle包裹（宽度比例1.5，适配更长文本）
        Rectangle {
            width: 169.1 ;height : parent.titalHeight ;color: "#ffffff" ;border.color: "#cccccc" ;border.width: 1 ;

            Text {
                anchors.centerIn: parent ; font.pixelSize: 14 ;font.bold: true ;color: "#000000";horizontalAlignment: Text.AlignHCenter  // 确保文本居中，避免溢出
                text: qsTr("信息描述")
            }
        }

        // 4. 结束时间：子Rectangle包裹
        Rectangle {
            width: 112.7 ;height : parent.titalHeight ;color: "#ffffff" ;border.color: "#cccccc" ;border.width: 1 ;

            Text {
                anchors.centerIn: parent; font.pixelSize: 14 ; font.bold: true ;color: "#000000" ;
                text: qsTr("结束时间")
            }
        }

        // 5. 持续时间：子Rectangle包裹
        Rectangle {
            width: 112.7 ;height : parent.titalHeight ;color: "#ffffff" ;border.color: "#cccccc" ;border.width: 1 ;

            Text {
                anchors.centerIn: parent ;font.pixelSize: 14 ;font.bold: true ;color: "#000000" ;
                text: qsTr("持续时间")
            }
        }
    }

    // 底部分隔线：增强标题行与下方内容的视觉边界
    Rectangle { anchors.left: parent.left ; anchors.right: parent.right ; anchors.bottom: parent.bottom ; height: 1; color: "#dddddd" }

    // 报警列表
    // 报警列表
    ListView {
        id: historyListView
        anchors.top: titleRow.bottom
        anchors.left: parent.left
        anchors.right: parent.right
        anchors.bottom: parent.bottom
        spacing: 1
        clip: true

        // 数据模型（绑定C++的HistoryModel）
        model: warningHistory

        // 跟踪用户是否手动滚动
        property bool userScrolled: false

        // 列表项代理
        delegate: Row {
            id: listItem
            width: 640
            height: 36

            // 开始日期
            Rectangle {
                width: 112.7; height: parent.height; color: "#ffffff"; border.color: "#eeeeee"; border.width: 1
                Text { anchors.centerIn: parent; text: model.startDate; font.pixelSize: 13; color: "#333333" }
            }

            // 开始时间
            Rectangle {
                width: 112.7; height: parent.height; color: "#ffffff"; border.color: "#eeeeee"; border.width: 1
                Text { anchors.centerIn: parent; text: model.startTime; font.pixelSize: 13; color: "#333333" }
            }

            // 信息描述
            Rectangle {
                width: 169.1; height: parent.height; color: "#ffffff"; border.color: "#eeeeee"; border.width: 1
                Text {
                    anchors.centerIn: parent; text: model.discripTion; font.pixelSize: 13; color: "#333333"
                    elide: Text.ElideRight; width: parent.width - 10; horizontalAlignment: Text.AlignHCenter
                }
            }

            // 结束时间
            Rectangle {
                width: 112.7; height: parent.height; color: "#ffffff"; border.color: "#eeeeee"; border.width: 1
                Text {
                    anchors.centerIn: parent; text: model.endTime; font.pixelSize: 13
                    color: model.endTime === qsTr("报警中") ? "#ff4444" : "#333333"
                    font.bold: model.endTime === qsTr("报警中")
                }
            }

            // 持续时间
            Rectangle {
                width: 112.7; height: parent.height; color: "#ffffff"; border.color: "#eeeeee"; border.width: 1
                Text { anchors.centerIn: parent; text: model.duationTime || "--:--:--"; font.pixelSize: 13; color: "#2980b9" }
            }
        }

        // 滚动条（唯一交互方式）
        ScrollBar.vertical: ScrollBar {
            policy: ScrollBar.AlwaysOn
            width: 8
            anchors.right: parent.right
            anchors.top: parent.top
            anchors.bottom: parent.bottom

            onPositionChanged: {
                historyListView.userScrolled = true;
            }
        }
    }

    // 自动滚动逻辑
    Connections {
        target: warningHistory

        function onModelReset() {
            if (!historyListView.userScrolled) {
                historyListView.positionViewAtEnd();
            }
        }

        function onRowsInserted() {
            if (!historyListView.userScrolled) {
                historyListView.positionViewAtEnd();
            }
        }
    }
}
